<!doctype html>
<html class="no-js">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>个人中心</title>
  <meta name="description" content="">
  <meta name="keywords" content="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <!-- Set render engine for 360 browser -->
    <meta name="renderer" content="webkit">
    <!-- No Baidu Siteapp-->
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <!-- Add to homescreen for Chrome on Android -->
    <meta name="mobile-web-app-capable" content="yes">
    <!-- Add to homescreen for Safari on iOS -->
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="Amaze UI"/>
    <!-- Tile icon for Win8 (144x144 + tile color) -->
    <meta name="msapplication-TileColor" content="#0e90d2">
    <!-- SEO: If your mobile URL is different from the desktop URL, add a canonical link to the desktop page https://developers.google.com/webmasters/smartphone-sites/feature-phones -->
    <!--
  <link rel="canonical" href="http://www.example.com/">
  -->
<!--   <link rel="icon" type="image/png" href="./i/home/timg.png"> -->
  <link rel="stylesheet" href="assets/css/amazeui.min.css">
  <link rel="stylesheet" href="assets/css/mine.css">

</head>
<body>

<header data-am-widget="header"
          class="am-header am-header-default">
      <div class="am-header-left am-header-nav">
         <!--  <a href="./index.html" class="">
              <img class="am-header-icon-custom" src="./assets/i/left.png" alt=""/>
          </a> -->
      </div>
      <h1 class="am-header-title">个人中心</h1>
  </header>

<div class="am-g am-u-sm-12 am-payrecord">
   <ul class="am-u-sm-12">
     <li>
       <div class="am-payrecord-title">
           <span >姓名：</span><span class="user-name"></span>
       </div>
       <div class="am-u-sm-12" style="height:30px;line-height:30px;">
          <div class="am-u-sm-12 am-pay-left">
             <span>手机：</span><span class="phone_name"></span>
          </div>
       </div>
       <div class="am-u-sm-12" style="height:30px;line-height:30px;">
          <div class="am-u-sm-12 am-pay-left">
             <span>身份证：</span><span class="identity_name"></span>
          </div>
        
       </div>
     </li>
   </ul>
</div>

<div class="am-u-sm-12" id="data">
<div class="am-g am-u-sm-12 am-payrecord" v-for="row in home" >
   <ul class="am-u-sm-12">
     <li>
       <div class="am-payrecord-title am-text-center" style="color:#FD8340;font-size:18px;" v-cloak>
          {{row.detail}}
       </div>
       <div class="am-u-sm-12" style="height:30px;line-height:30px;">
          <div class="am-u-sm-12 am-pay-left am-text-center">
              <a :href="'jiaofei.html?house_property_id='+row.id" class="am-go-pay"  @click="goPay(row)">
             <span class="am-pay-button">前往缴费</span></a>
          </div>
       </div>
     </li>
   </ul>
</div>
</div>

</body>
<script src="assets/js/jquery.min.js"></script>
<script src="assets/js/amazeui.min.js"></script>
<script src="assets/js/global.js"></script>
<script src="layer/layer.js"></script>
<script src="assets/js/vue.min.js"></script>

<script>
    var access_token = '';
    initGlobalPage();
    access_token = sessionStorage.access_token;
    var vue=new Vue({
        el:'#data',
        data:{
            home:{}, //拥有的房产
        },
        methods:{
            goPay:function(name){
               if(name.water_charge&&name.property_charge==0){
                   // console.log(this.$refs);
                   // var that=event.currentTarget;
                   // console.log(that);
                   $('.am-go-pay').attr('href','javascript:void(0);');
                   layer.msg('您已缴过费用!');
                   setTimeout(function(){
                       location.reload();
                   },1000)
               }
            }
        }

    });
 function getUserInfo(){
        var data={
            token:access_token,
        };
     $.ajax({
         method:"get",
         data: data,
         url:"http://www.726bh9.cn/index/user/ajax_get_owner_info",
         async:false ,
         success:function (result) {
             // console.log(result);
             if (result.code ==1){
                  // console.log(111);
                 var data=result.data;
                 // console.log(data);

                 $('.user-name').text(data.name);
                 $('.phone_name').text(data.phone);
                 $('.identity_name').text(data.id_card);

             }
             if (result.code ==3){
                 self.location="bangding-info.html";
             }
             if (result.code ==-1){
                 // sessionStorage.clear();
                 initGlobalPage();
                 return;
             }
         },error:function (data) {

         }

     })
 }
 //获取房产选择列表
 function getHomeId(){
     var data={
         token:access_token,
     };
     $.ajax({
         method:"get",
         data: data,
         url:"http://www.726bh9.cn/index/user/ajax_get_house_property",
         async:false ,
         success:function (result) {
             // console.log(result);
             if (result.code ==1){

                 var data=result.data;
                 vue.home=data;
             }
             if (result.code ==3){
                 self.location="bangding-info.html";
             }
             if (result.code ==-1){
                 // sessionStorage.clear();
                 initGlobalPage();
                 return;
             }
         }

     })
 }

 $(function(){
     getUserInfo();
     getHomeId();
 })
</script>



</html>
